import React, { Component } from 'react'
import { Form, Input } from 'antd';
import axios from 'axios';

export default class EditForm extends Component {
    state={addTime:'',url:this.props.data.video_url};

    formRef = React.createRef();

    componentDidMount() {
        const { setFieldsValue } = this.formRef.current;
        setFieldsValue({
            video_id: this.props.data.video_id,
            video_author: this.props.data.video_author,
            video_time: this.props.data.video_time,
            video_url: this.state.url
        });
    }

    videoitem=(e)=>{
        let that=this;
    
        let video=document.getElementById('videoitem').files[0];
     
          var formData=new FormData();
          formData.append('video',video);
          
          const token=localStorage.getItem('token');
          if(token){
              // console.log(token);
              axios.post("https://wx.xxmtcds.top:2333/admin/storemusic",formData,{
                headers: { 'authorization': `${token}`,'content-type':'multipart/form-data' }
              })
                .then(function(response){
                  that.setState({url: response.data})
                  that.formRef.current.setFieldsValue({ video_url:that.state.url });
                  console.log(that.state.url);
                })
                .catch(err=>console.log(err))
        }
    
      }

    render() {


        return (
            <Form ref={this.formRef}
                layout="horizontal"
                labelCol={{ span: 4 }}//不能超过24
                wrapperCol={{ span: 10 }}>

                <Form.Item name="video_id" label='编号'>
                    <Input disabled={true} />
                </Form.Item>

                <Form.Item name="video_author" label='作者'
                    rules={[ {
                        required: true,
                        message: '请输入用户名',
                    }]}>
                    <Input placeholder='用户名' />
                </Form.Item>
                <Form.Item name="video_time" label='添加时间'
                    rules={[{
                        required: true,
                        pattern:/\d{4}-\d{2}-\d{2}/,
                        message: '时间格式为yyyy-mm-dd',
                    }]}>
                    <Input placeholder='' />
                </Form.Item>
                <Form.Item name="video_url" label='url'>
                    <Input placeholder={this.state.url} disabled="true"/>
                    <input type='file' placeholder='修改网址' accept=".jpg" name="storefile" onChange={this.videoitem} id="videoitem"/>
                </Form.Item>
            </Form>
        )
    }
}

